import React from "react";
import "../css/todoTop.css";
import {PENDDING} from "./config"
export default class TodoTop extends React.Component{
    constructor(props){
        super(props)
    }
        
    render(){
        return(
            <div className="todoTop_cantainer">
                <div className="todoTop_wrapper_txt">
                    <h2>ToDoList</h2>
                </div>
                <div className="todoTop_wrapper_input">
                    <input placeholder="添加ToDo"
                    ref="eveInput"
                    onKeyDown={(event)=>{
                        var keyCode = event.keyCode
                        // console.log(keyCode);
                        if(keyCode===13){
                            //拿到input的值
                        var value = this.refs.eveInput.value;

                        //容错判断
                        if(value.length === ''){
                           alert('添加的内容不能为空!!')
                            return;
                        }

                        var todo = {
                            content:value,
                            status:PENDDING,
                        }
                        this.props.addTodo(todo)
                        this.refs.eveInput.value = '';
                        }
                    }}/>
                </div>
            </div>
        )
    }
}

